<template>
  <div class="d-scroll listInner bg-white companyInformation">
    <div class="p-1">
      <custom-company-title :title="dataItem['danweiName']" />
      <div class="button_warp mt-1">
        <el-form ref="form" :model="form" label-width="22vw">
          <el-form-item label="数据年份">
            <custom-timer title="数据年份" class="companyInformation__time" :is-show-icon="false" :is-title="false" type="year" :is-interval="false" placeholder="请选择数据年份" :date-value="form.year" @update:dateValue="getTime" />
          </el-form-item>
        </el-form>
        <van-button class="customButton w-26" size="small" icon="search" type="info" @click="openSuperSearch">查询</van-button>
      </div>
      <custom-radio-tag1 class="mx-1 mb-1 w-100 my-2" :list="tabList" check-value="基本信息" @change="tagChange" />
      <div class="companyInformation__container">
        <van-cell-group v-if="menuMobileList.length > 0">
          <van-cell v-for="item in menuMobileList" :key="item['tbNames']" :title="item['tbTitle']" />
        </van-cell-group>
        <van-empty
          v-else
          class="custom-image"
          image="https://img01.yzcdn.cn/vant/custom-empty-image.png"
          description="暂无数据"
        />
      </div>
    </div>
    <div class="companyInformation__footer">
      <van-button class="customButton" size="small" icon="plus" color="#22bff9" @click="openAddCheckOptionsDrawer">新增核查意见</van-button>
      <van-button class="customButton" size="small" icon="guide-o" type="info" @click="openHistoryOptionsDrawer">历史核查意见</van-button>
    </div>
    <!-- 新增核查意见 -->
    <van-popup
      v-model="addCheckOpinionsParams.isShow"
      position="right"
      lock-scroll
      safe-area-inset-bottom
      class="custom-van-pop-2"
      :style="{ height: '100%', width: '100%' }"
      @close="closeAddCheckOpinionsHandler"
    >
      <div class="common-details">
        <customDetailsTopbar :title="addCheckOpinionsParams.title" flag @back="addCheckOpinionsParams.isShow = false" />
        <addCheckOpinions ref="addCheckOpinionsRef" :data-item="dataItem" :task-id="dataItem['pkId']" @cancel="closeAddCheckOpinionsHandler" />
      </div>
    </van-popup>
    <!-- 历史核查意见信息展示 -->
    <van-popup
      v-model="historicalOpinionsParams.isShow"
      position="right"
      :style="{ height: '100%', width: '100%' }"
      @close="historicalOpinionsParams.isShow = false"
    >
      <div class="common-details">
        <customDetailsTopbar :title="historicalOpinionsParams.title" flag @back="historicalOpinionsParams.isShow = false" />
        <historicalOpinions ref="historicalOpinionsRef" :task-id="taskId" />
      </div>
    </van-popup>
  </div>
</template>
<script>
import CustomCompanyTitle from '@/components/globals/custom-company-title.vue'
import customTimer from '@/components/common/custom-timer.vue'
import { getMenuMobile, getTaskId } from '@/api/special'
import CustomDetailsTopbar from '@/components/globals/custom-details-topbar.vue'
import HistoricalOpinions from '@/views/special/components/historicalOpinions.vue'
import AddCheckOpinions from '@/views/special/components/addCheckOpinions.vue'

export default {
  components: { AddCheckOpinions, HistoricalOpinions, CustomDetailsTopbar, customTimer, CustomCompanyTitle },
  id: 'companyInformation',
  inject: ['layout'],
  props: {
    /**
     * 当前项
     */
    dataItem: {
      type: Object,
      default: () => {}
    },
    /**
     * 企业类型
     */
    type: {
      type: String,
      default: () => ''
    }
  },
  data() {
    return {
      form: {
        year: ''
      },
      tabList: [
        { label: '空间信息', value: '' },
        { label: '汇总表信息', value: '' }
      ],
      taskId: '', // 任务ID
      menuMobileList: [], // 根据任务ID获取企业表
      historicalOpinionsParams: {
        isShow: false,
        title: ''
      }, // 历史核查意见抽屉
      addCheckOpinionsParams: {
        isShow: false,
        title: ''
      } // 新增核查意见抽屉
    }
  },
  methods: {
    /**
     * 获取企业详情
     * @param tbnf
     * @returns {Promise<void>}
     */
    async getCompanyInformation(tbnf) {
      try {
        this.layout.showAreaLoading(['.companyInformation__container'])
        this.form.year = tbnf
        const taskId = await getTaskId({ id: this.dataItem['qiyeId'], tbnf })
        this.taskId = taskId.data
        const { status, data } = await getMenuMobile({ taskId: taskId.data, pcdx: this.type, id: this.dataItem['qiyeId'] })
        if (status === 0 && data) {
          this.menuMobileList = data
        } else {
          this.menuMobileList = []
        }
        this.layout.hideAreaLoading(['.companyInformation__container'])
      } catch (err) {
        console.log(err)
      }
    },
    /**
     * 查询
     */
    async openSuperSearch() {
      await this.getCompanyInformation(this.form.year)
    },
    /**
     * 获取时间
     * @param val
     */
    getTime(val) {
      this.form.year = val
    },
    /**
     * tab切换
     */
    tagChange(tagArg) {
      console.log(tagArg)
    },
    /**
     * 打开历史核查意见抽屉
     */
    async openHistoryOptionsDrawer() {
      this.historicalOpinionsParams.isShow = true
      this.historicalOpinionsParams.title = '历史核查意见'
      await this.$refs.historicalOpinionsRef.getHistoryOptionsHandler()
    },
    /**
     * 打开新增核查意见抽屉
     */
    async openAddCheckOptionsDrawer() {
      this.addCheckOpinionsParams.isShow = true
      this.addCheckOpinionsParams.title = '新增核查意见'
      this.$nextTick(() => {
        this.$refs.addCheckOpinionsRef.initFormFiledName()
      })
    },
    /**
     * 关闭新增核查意见抽屉
     */
    closeAddCheckOpinionsHandler() {
      this.addCheckOpinionsParams.isShow = false
      this.$refs.addCheckOpinionsRef.resetFrom()
    }
  }
}
</script>
<style lang="scss" scoped>
.companyInformation {
  position: relative;
  &__footer {
    background-color: #EDF0F5;
    height: 90px;
    color: white;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  &__time {
    margin-bottom: 0 !important;
    margin-top: 12px !important;
  }
}
::v-deep .van-cell__title {
  span {
    color: #3f99ff;
  }
}
</style>
